import 'package:flutter/material.dart';

import '../common.dart';

class Exchange extends StatefulWidget {
  Exchange({super.key});
  @override
  State<Exchange> createState() => _QGRulePageState();
}

class _QGRulePageState extends State<Exchange> {
  List thirdList = [];
  List cateList = [];
  int tindex = 0;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();

    getData(url: '/third/cate').then((ress) {
      cateList = ress;
      ggetData(ress[0]['id']);
    });
  }

  ggetData(id) {
    getData(url: '/third/index', data: {'cate_id': '$id'}).then((res) {
      thirdList = res;
      setState(() {});
    });
  }

  @override
  Widget build(BuildContext context) {
    final totalHeight = MediaQuery.of(context).size.height - 260;
    final totalw = (MediaQuery.of(context).size.width - 113) / 2;

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Stack(
          children: [
            GestureDetector(
              onTap: () {
                // toNamed('/home/exchange/parties');
              },
              child: wImage(url: 'shuzi', height: 200, width: double.infinity),
            ),
            Positioned(
              bottom: 0,
              right: 0,
              left: 0,
              child: Container(
                height: 20,
                decoration: BoxDecoration(
                  color: Color(0XFFFFFFFF),
                  borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(20),
                    topRight: Radius.circular(20),
                  ),
                ),
              ),
            ),
            Positioned(
              top: 70,
              right: 0,
              child: GestureDetector(
                onTap: () {
                  toNamed('/web_tabs/shopping/mall_address');
                },
                child: Container(
                  alignment: Alignment.center,
                  width: 63,
                  height: 28,
                  decoration: BoxDecoration(
                    color: Color.fromRGBO(15, 23, 43, 0.2),
                    borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(20),
                      bottomLeft: Radius.circular(20),
                    ),
                  ),
                  child: wText(text: '收货地址', color: 'ffffff'),
                ),
              ),
            ),
            Positioned(
              top: 113,
              right: 0,
              child: GestureDetector(
                onTap: () {
                  toNamed('/user/mall_integral');
                },
                child: Container(
                  alignment: Alignment.center,
                  width: 63,
                  height: 28,
                  decoration: BoxDecoration(
                    color: Color.fromRGBO(15, 23, 43, 0.2),
                    borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(20),
                      bottomLeft: Radius.circular(20),
                    ),
                  ),
                  child: wText(text: '兑换明细', color: 'ffffff'),
                ),
              ),
            ),
          ],
        ),
        Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Container(
              width: 82,
              height: totalHeight,
              decoration: BoxDecoration(
                color: Color(0XFFF8F9FD),
                borderRadius: BorderRadius.only(topRight: Radius.circular(15)),
              ),
              child: Column(
                children: [
                  for (var item in cateList.asMap().entries)
                    GestureDetector(
                      onTap: () {
                        tindex = item.key;
                        ggetData(cateList[tindex]['id']);
                        setState(() {});
                      },
                      child: Container(
                        padding: EdgeInsets.symmetric(
                          horizontal: 10,
                          vertical: 10,
                        ),
                        width: 82,
                        decoration: BoxDecoration(
                          color: Color(
                            tindex == item.key ? 0XFF0F172B : 0XFFF8F9FD,
                          ),
                          borderRadius: BorderRadius.only(
                            topRight: Radius.circular(8),
                          ),
                        ),
                        child: Align(
                          child: Text(
                            '${item.value['title']}',
                            maxLines: 2,
                            overflow: TextOverflow.ellipsis,
                            style: TextStyle(
                              fontSize: 12,
                              color: Color(
                                tindex == item.key ? 0XFFFFFFFF : 0XFF0F172B,
                              ),
                            ),
                          ),
                        ),
                      ),
                    ),
                ],
              ),
            ),
            Expanded(
              child: Container(
                padding: EdgeInsets.symmetric(horizontal: 10),
                child: Wrap(
                  spacing: 10,
                  runSpacing: 10,
                  children: [
                    if (thirdList.isEmpty)
                      Container(
                        margin: EdgeInsets.only(top: 120),
                        child: Align(
                          child: wText(text: '暂无数据', color: '999999', size: 15),
                        ),
                      ),
                    for (var item in thirdList.asMap().entries)
                      GestureDetector(
                        onTap: () {
                          toNamed(
                            '/home/exchange/details?uuid=${item.value['uuid']}',
                          );
                        },
                        child: Container(
                          margin: EdgeInsets.only(bottom: 10),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Stack(
                                children: [
                                  wImage(
                                    url: '${item.value['thumb']}',
                                    width: totalw,
                                    height: totalw,
                                    borderRadius: 10,
                                  ),
                                  // Positioned(
                                  //   top: 10,
                                  //   left: 10,
                                  //   child: wImage(url: 'xiyou', width: 56),
                                  // ),
                                ],
                              ),
                              SizedBox(height: 3),
                              Container(
                                width: totalw,
                                height: 42,
                                child: Text(
                                  '${item.value['title']}',
                                  style: TextStyle(fontSize: 14),
                                  maxLines: 2,
                                  overflow: TextOverflow.ellipsis,
                                ),
                              ),

                              // wText(
                              //   text: '${item.value['title']}',
                              //   size: 14,
                              //   bold: true,
                              // ),
                              SizedBox(height: 2),
                              wText(
                                text: '可兑换${item.value['stock']}份',
                                color: '878b95',
                              ),
                            ],
                          ),
                        ),
                      ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ],
    );
  }
}
